<template>
  <page-header-wrapper :title="false">
    <a-row :gutter="50">
      <a-col :md="12">
        <a-card title="退款信息">
          <a-form-model :label-col="labelCol" :wrapper-col="wrapperCol">
            <a-form-model-item label="退款ID"><b>{{ refund.refund_id }}</b></a-form-model-item>
            <a-form-model-item label="申请顾问"><b>{{ refund.apply_adviser }}</b></a-form-model-item>
            <a-form-model-item label="合同编号"><b>{{ refund.contract_no }}</b></a-form-model-item>
            <a-form-model-item label="退款金额"><b>{{ refund.amount }}</b></a-form-model-item>
            <a-form-model-item label="扣除当月工资"><b>{{ refund.deduct_wages }}</b></a-form-model-item>
            <a-form-model-item label="退款理由"><b>{{ refund.reason }}</b></a-form-model-item>
            <a-form-model-item label="退款申请单">{{ refund.apply_file_name }} <a-icon :style="{ color: '#40a9ff', fontSize: '18px' }" type="download" @click="downFile(refund.apply_file_url, refund.apply_file_name)" /></a-form-model-item>
            <a-form-model-item label="客户沟通截图"><a :href="refund.communicate_img_map"><img :src="refund.communicate_img_map" width="40"></a></a-form-model-item>
            <a-form-model-item label="退款时间"><b>{{ refund.refund_time }}</b></a-form-model-item>
            <a-form-model-item label="退款截图"><a :href="refund.refund_img_map"><img :src="refund.refund_img_map" width="40"></a></a-form-model-item>
            <a-form-model-item label="备注"><b>{{ refund.remarks }}</b></a-form-model-item>
            <a-form-model-item label="状态"><b>{{ refundStatus[refund.status] }}</b></a-form-model-item>
            <a-form-model-item label="提交审核时间"><b>{{ refund.submit_check_time }}</b></a-form-model-item>
            <a-form-model-item label="创建时间"><b>{{ refund.created_at }}</b></a-form-model-item>
            <a-form-model-item label="最后更新时间"><b>{{ refund.updated_at }}</b></a-form-model-item>
          </a-form-model>
        </a-card>
      </a-col>
      <a-col :md="12">
        <a-card title="审核记录">
          <a-empty description="没有审核记录" v-if="checkHistores.length == 0" />
        </a-card>
      </a-col>
    </a-row>
  </page-header-wrapper>
</template>

<script>
import { refundDetail } from '@/api/contract'
import apis from '@/api'

export default {
  name: 'RefundDetail',
  data () {
    return {
      labelCol: { span: 6 },
      wrapperCol: { offset: 1, span: 14 },
      queryParam: {},
      refund: {},
      refundStatus: [],
      checkHistores: []
    }
  },
  created () {
    this.getRefund(this.$route.params.rid)
  },
  methods: {
    getRefund (rid) {
      refundDetail(rid).then(res => {
        if (res.status === 0) {
          this.refundStatus = res.result.status_opts
          delete res.result.status_opts
          this.checkHistores = res.result.check_histories
          delete res.result.check_histories
          this.refund = res.result
        }
      })
    },
    downFile (value, filename) {
      window.open(apis.Download + '?value=' + value + '&filename=' + filename)
    }
  }
}
</script>

<style scoped>
.ant-form-item {
  margin-bottom: 5px;
}
</style>
